<template>
    <div style=" background-color: #fff;height: 14vw;">
      <span class="n-title" >分享社区！</span>
      <span class="n-addnote">
      </span>
    </div>

    <div style="height:6px;background-color: rgb(240,240,240);"></div>


    <van-tabs v-model:active="topBar">
      <van-tab title="日记分享">
        <div v-for="(item, index) in diarys" :key="item.diaryId"  class="diary-card" @click="toDetial(item.diaryId)">
            <div class="d-info">
              <span style="font-size: 4vw;color: #777;">匿名</span>
              <span style="font-size: 4vw;font-weight: 600;">{{dateFilter(item.startTime)}}</span>
            </div>
            <div class="d-content">
                <p class="d-p">&nbsp;&nbsp;&nbsp;&nbsp;{{item.diaryContent}}</p>
            </div>
        </div>
      </van-tab>
      <van-tab title="待办分享">
        <div class="n-newNote" v-for="(note,index) in notes" :key="note.noteId">
          <div class="n-noteTop">
          </div>
          <Transition name="slide-fade"  v-for="item in note.noteItems" :key="item.itemId">
            <div class="n-item" >
                <div style="width: 80vw;">{{item.itemContent}}</div>
            </div>
          </Transition>
          <div class="n-noteBottom"> 
            <div>
              <van-button color="#f9cdd4" size="small"  @click="onUpUnfinished(note.noteId)">加入我的待办</van-button>
            </div>
            <div style="width:12vw;padding-left:2vw;box-sizing: border-box;">
            </div>
          </div>
        </div>

      </van-tab>
    </van-tabs> 
  </template>
  
  <script>
  // @ is an alias to /src
  import {store} from '../utils/store.js'
  import axios from 'axios'
  import {getDate} from "../utils/time.js"
  import { showToast,showSuccessToast, showFailToast, showConfirmDialog } from 'vant';


  
  export default {
    name: 'ShareView',
    data(){
      return{
        topBar:0,
        diarys:[],
        notes:[]
      } 
    },
    methods:{
      getSharedNote(){
        this.diarys=[]
        axios.get("/api/Note/getSharedNotes",)
        .then((res)=>{
          this.notes=res.data.data
          console.log(this.notes)
        }).catch((error)=>{
          console.log(error)
        })
      },
      getSharedData(){
        this.diarys=[]
        axios.get("/api/Diary/findSharedDiary",)
        .then((res)=>{
          this.diarys=res.data.data
          console.log(this.diarys)
        }).catch((error)=>{
          console.log(error)
        })
      },
      toDetial(diaryId){
        this.$router.push({
            path:  '/detial',
            query: {
              diaryId: diaryId,
              anonymity: 1
            },
          })
      },
      onUpUnfinished(id){
        axios.get('/api/Note/pushOtherNote', {
              params:{noteId:id, loverId:store.loverInfo.loverId}
            }).then((res)=>{
              console.log(res.data)
              showSuccessToast("添加成功")
              //这个时候必须刷新allnotes
            }).catch(function (error) {console.log(error);}) 
      },
      dateFilter(n){
       return getDate(n)
      },
    },
    activated(){
      store.active="share"
      if(!store.queryFlag){
        this.$router.replace("/home/diary")
      }else{
        if(store.loverInfo!=null){
          this.getSharedData()
          this.getSharedNote()
        }
      }
    },
    mounted(){
      store.active="share"
    },
    components: {

    }
  }
  </script>